<template>
  <div>
    <div class="search">
      <el-form :inline="true" class="demo-form-inline">
        <el-form-item label="教学班">
          <el-select v-model="teachid">
            <el-option value="全部">全部</el-option>
            <el-option v-for="(item,index) in teachidData" :key="index" :value="item.teachid">{{ item.teachid }}</el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button  @click="search">查询</el-button>
        </el-form-item>
        <el-form-item label="平时分占比">
          <el-input v-model.number="propotion" class="propotion"></el-input>
        </el-form-item>
        <span class="span">%</span>
        <el-form-item>
          <el-button @click="computedScore">计算</el-button>
        </el-form-item>
        <el-form-item class="submit">
          <el-button type="primary" @click="onSubmit">提交</el-button>
        </el-form-item>
      </el-form>
    </div>
    <div class="course">
      <el-table
      :data="scoreData"
      border
      style="width: 100%"
      height="535px"
      :default-sort = "{prop: 'grade', order: 'descending'}">
        <el-table-column
          prop="id"
          label="学号"
          width="163"
          header-align="center"
          align="center">
        </el-table-column>
        <el-table-column
          prop="name"
          label="姓名"
          width="163"
          header-align="center"
          align="center">
        </el-table-column>
        <el-table-column
          prop="cname"
          label="课程名称"
          width="235"
          header-align="center"
          align="center">
        </el-table-column>
        <el-table-column
          prop="teachid"
          label="教学班号"
          width="180"
          header-align="center"
          align="center">
        </el-table-column>
        <el-table-column
          prop="nscore"
          label="平时成绩"
          width="150"
          header-align="center"
          align="center">
          <template slot-scope="scope">
            <el-input v-model.number="scope.row.nscore"></el-input>
          </template>
        </el-table-column>
        <el-table-column
          prop="rscore"
          label="卷面成绩"
          width="150"
          header-align="center"
          align="center">
          <template slot-scope="scope">
            <el-input v-model.number="scope.row.rscore"></el-input>
          </template>
        </el-table-column>
        <el-table-column
          prop="grade"
          label="成绩"
          width="150"
          header-align="center"
          align="center"
          sortable>
        </el-table-column>
      </el-table>
    </div>
  </div>
</template>

<script>
import { getTeachId } from '@/api/score'
import { getScoreCourse } from '@/api/score'
import { getAllScoreCourse } from '@/api/score'
import { submitScore } from '@/api/score'
export default {
  data(){
    return{
      teachidData:[],
      scoreData:[],
      teachid:'全部',
      propotion:0
    }
  },
  methods:{
    search(){
      if(this.teachid==='全部'){
        this.$nextTick(()=>{
          getAllScoreCourse().then(res=>{
            if(res.data.status===0){
              this.scoreData=res.data.data
              for(let i=0;i<this.scoreData.length;i++){
                this.scoreData[i].id=res.data.data[i].sid
                delete this.scoreData[i].sid
              }
            }
          })
        })
      }else{
        getScoreCourse({teachid:this.teachid}).then(res=>{
          if(res.data.status===0){
            this.scoreData=res.data.data
          }else{
            this.$message({
              message: '查询失败',
              type: 'error'
            })
          }
        })
      }
    },
    computedScore(){
      if(this.propotion===0){
        this.$message({
          message: '请输入平时分占比！',
          type: 'warning'
        })
      }else{
        for(let i=0;i<this.scoreData.length;i++){
          this.scoreData[i].grade=Math.round(this.scoreData[i].nscore*this.propotion/100+this.scoreData[i].rscore*(100-this.propotion)/100)||0
        }
      }
    },
    onSubmit(){
      let flag=true
      for(let i=0;i<this.scoreData.length;i++){
        if(!this.scoreData[i].grade){
          this.scoreData[i].grade=0
        }
        setTimeout(()=>{
          submitScore({id:this.scoreData[i].id,teachid:this.scoreData[i].teachid,grade:this.scoreData[i].grade}).then(res=>{
            if(res.data.status!==0){
              flag=false
            }
          })
        },100)
      }
      if(flag){
        this.$message({
          message: '提交成绩成功！',
          type: 'success'
        })
      }else{
        this.$message({
          message: '提交成绩失败！',
          type: 'error'
        })
      }
    }
  },
  mounted(){
    this.$nextTick(()=>{
      getTeachId().then(res=>{
        if(res.data.status===0){
          this.teachidData=res.data.data
        }
      })
    })
    this.$nextTick(()=>{
      getAllScoreCourse().then(res=>{
        if(res.data.status===0){
          this.scoreData=res.data.data
          for(let i=0;i<this.scoreData.length;i++){
            this.scoreData[i].id=res.data.data[i].sid
            delete this.scoreData[i].sid
          }
        }
      })
    })
  }
}
</script>

<style scoped>
.span{
  padding-right: 10px;
  line-height: 40px;

}
.propotion{
  width:50px;
}
</style>